<template>
	<view class="content">
		<view class="top-bg" v-if="type==0">
			<view class="top-line">
				<view class="top-item">
					<view class="text" style="flex:1;">工序:</view>
					 <view style="flex:3;margin-right: 20px;">
					 	<uni-data-select v-model="procedure_value" :localdata="procedures" @change="selectChange" :clear="false"></uni-data-select>
					 </view>
				</view>
			</view>
		</view>
		
		<view class="content-bg">
			<view class="charts-box">
				<qiun-data-charts type="column" :opts="{dataLabel:false,xAxis:{rotateLabel:true},extra:{column:{type:'stack',width:10}}}" :chartData="chartsData"/>
			</view>
		</view>
	</view>
</template>

<script>
	import {GetShiftProcessCounts,GetProductGoodNum} from '../../common/screen-old.js'
	import * as util from '../../common/util.js'
	
	export default {
		data() {
			return {
				type:0,
				products: [],
				product_code: '',
				procedures:[{
					text:"铸造",
					value:"铸造"
				},{
					text:"机加",
					value:"机加"
				},{
					text:"清理",
					value:"清理"
				},{
					text:"生产",
					value:""
				}],
				procedure_value:'铸造',
				loading: false,
				dataArray:[],
				tableData:{},
				// 每页数据量
				pageSize: 10,
				// 当前页
				pageCurrent: 1,
				// 数据总量
				total: 0,
				chartsData:{},
			};
		},
		onLoad(option){
			console.log("onLoad>>>");
			this.type = option.type;
			if (option.type == 0) {
				uni.setNavigationBarTitle({
					title: "当日班次生产数量"
				})
			} 
			else {
				uni.setNavigationBarTitle({
					title: "当月产品生产数量"
				})
			}
			this.loadData();
		},
		onNavigationBarButtonTap:function(e){
			uni.navigateTo({
				url: '/pages/product/product-detail?type=' + this.type
			});
		},
		methods:{
			
			loadData(){
				if (this.type == 0) {
					var data = {
						"procedurename": this.procedure_value
					}
					GetShiftProcessCounts(data).then(res=>{
						console.log(">>>",res);
						var result = JSON.parse(res);
						this.dataArray = result;
						console.log(result);
						this.setChartDataDay(result);
					});
				}
				else {
					GetProductGoodNum().then(res=>{
						console.log(res);
						var result = JSON.parse(res);
						this.dataArray = result;
						this.setChartDataMonth(result);
					});
				}
			},
			
			selectChange(){
				this.loadData();
			},
			
			setChartDataDay(data){
				var categories = [];
				
				var plannums = [];
				var completenums = [];
				var procedure = this.procedure_value;
				data.source.forEach(item => {
					if (item.procedurename.indexOf(procedure) == -1) {
						return;
					}
					categories.push(item.productname);
					plannums.push(item.计划数量);
					completenums.push(item.完成数量);
				});
				var series = [
					{
						"name": "计划数量",
						"data": plannums
					},
					{
						"name": "完成数量",
						"data": completenums
					}
				];
				var ata = {
					"categories": categories,
					"series": series
				};
				console.log("ata", ata);
				this.chartsData = ata;
			},
			setChartDataMonth(data){
				console.log(data);
				var categories = [];
				
				var plannums = [];
				var totalnums = [];
				data.source.forEach(item => {
					categories.push(item.product_name);
					plannums.push(item.计划数量);
					totalnums.push(item.实际总数);
				});
				var series = [
					{
						"name": "计划数量",
						"data": plannums
					},
					{
						"name": "实际总数",
						"data": totalnums
					}
				];
				var ata = {
					"categories": categories,
					"series": series
				};
				console.log(ata);
				this.chartsData = ata;
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("./product-index.css");
</style>
